<template>
  <div class="app-container">
    <!-- 查询和其他操作 -->
    <el-form :inline="true" class="demo-form-inline filter">
      <div>
        <el-form-item label="报废日期">
          <el-date-picker v-model="alarmdate" type="daterange" range-separator="至" start-placeholder="开始日期"
            end-placeholder="结束日期" />
        </el-form-item>
        <el-form-item label="单据编号">
          <el-input v-model="listQuery.fbillno" clearable class="filter-item" placeholder="请输入单据编号" />
        </el-form-item>
        <el-form-item label="单据状态" style="margin-left: 20px">
          <el-select v-model="listQuery.fbillstate" class="filter-item" clearable placeholder="请选择单据状态">
            <el-option v-for="item in fbillstateOptions" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
      </div>
      <div>
        <span v-if="this.$store.state.user.fsiteLevel == 3">
          <el-form-item label="客户名称">
            <el-select disabled v-model="listQuery.fsiteNo" clearable filterable class="filter-item"
              placeholder="请选择客户名称">
              <el-option v-for="item in getListfsiteNo" :key="item.value" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="报废人员" style="margin-left: 70px">
            <div style="
              display: flex;
              justify-content: flex-end;
              align-items: center;
            ">
              <el-select style="display: inline-block;" clearable filterable v-model="listQuery.fmrkuser"
                class="filter-item" placeholder="请选择报废人员">
                <el-option v-for="item in getListfmrkuser" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
              <i style="
                display: inline-block;
                width: 20px;
                color: #409eff;
                margin-left: 3px;
              " class="el-icon-search" @click="searchDialoguse('search')" />
            </div>
          </el-form-item>
          <el-form-item label="报废地点">
            <div style="
              display: flex;
              justify-content: flex-end;
              align-items: center;
            ">
              <el-select style="display: inline-block;" clearable filterable v-model="listQuery.fpointNo"
                class="filter-item" placeholder="请选择报废地点">
                <el-option v-for="item in getListfpointNo" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
              <i style="
                display: inline-block;
                width: 20px;
                color: #409eff;
                margin-left: 3px;
              " class="el-icon-search" @click="searchDialoglab('search')" />
            </div>
          </el-form-item>
        </span>
        <span v-else>
          <el-form-item label="客户名称">
            <el-select @change="changeFsiteNo" v-model="listQuery.fsiteNo" clearable filterable class="filter-item"
              placeholder="请选择客户名称">
              <el-option v-for="item in getListfsiteNo" :key="item.value" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="报废人员" style="margin-left: 70px">
            <div style="
              display: flex;
              justify-content: flex-end;
              align-items: center;
            ">
              <el-select style="display: inline-block;" clearable filterable v-model="listQuery.fmrkuser"
                class="filter-item" placeholder="请选择报废人员">
                <el-option v-for="item in getListfmrkuserArea" :key="item.value" :label="item.label"
                  :value="item.value" />
              </el-select>
              <i style="
                display: inline-block;
                width: 20px;
                color: #409eff;
                margin-left: 3px;
              " class="el-icon-search" @click="searchDialoguse('search')" />
            </div>
          </el-form-item>
          <el-form-item label="报废地点">
            <div style="
              display: flex;
              justify-content: flex-end;
              align-items: center;
            ">
              <el-select style="display: inline-block;" clearable filterable v-model="listQuery.fpointNo"
                class="filter-item" placeholder="请选择报废地点">
                <el-option v-for="item in getListfpointNoArea" :key="item.value" :label="item.label"
                  :value="item.value" />
              </el-select>
              <i style="
                display: inline-block;
                width: 20px;
                color: #409eff;
                margin-left: 3px;
              " class="el-icon-search" @click="searchDialoglab('search')" />
            </div>
          </el-form-item>
        </span>
      </div>
      <el-form-item>
        <!-- v-permission="['issue:mrkHead:read']" -->
        <el-button round size="medium" class="filter-item"
          :style="{ background: buttonColor.lookup, color: buttonColor.color }" @click="handleFilter">查找</el-button>
        <!-- v-permission="['issue:mrkHead:create']" -->
        <el-button round size="medium" class="filter-item"
          :style="{ background: buttonColor.add, color: buttonColor.color }" @click="handleCreate">添加</el-button>
      </el-form-item>
    </el-form>

    <!-- 查询结果 -->
    <el-table :height="buttonColor.clientHeightThree" v-loading="listLoading" :data="list" :header-cell-style="tableColor" stripe
      element-loading-text="正在查询中。。。" border fit highlight-current-row>

      <el-table-column align="center" label="操作" class-name="small-padding" :width="buttonColor.operationThree">
        <template slot-scope="scope">
          <div class="operationButton">
          <div :style="{ color: buttonColor.edit, cursor: 'pointer' }" @click="handleUpdate(scope.row)">
              <img src="../../../public/images/edit.png" />
              编辑
            </div>
            <div v-if="scope.row.fbillstate === 1" :style="{ color: buttonColor.examine, cursor: 'pointer' }"
              @click="audit(scope.row)">
              <img src="../../../public/images/examine.png" />
              确定
            </div>
            <div v-else :style="{ color: buttonColor.examine, cursor: 'pointer' }">
              <img src="../../../public/images/examine.png" />
              确定
            </div>
            <div v-if="scope.row.fbillstate === 1" :style="{ color: buttonColor.invalid, cursor: 'pointer' }"
              @click="auditDelete(scope.row)">
              <img src="../../../public/images/invalid.png" />
              作废
            </div>
            <div v-else :style="{ color: buttonColor.invalid, cursor: 'pointer' }">
              <img src="../../../public/images/invalid.png" />
              作废
            </div>
          </div>
        </template>
      </el-table-column>
      <el-table-column :index="indexMethod" align="center" label="序" type="index" />
      <el-table-column align="center" label="单据编号" prop="fbillno" width="150" />
      <el-table-column v-if="this.$store.state.user.fsiteLevel != 3" :formatter="formatfsiteNo" width="200"
        align="center" label="客户名称" prop="fsiteNo" />
      <el-table-column :formatter="formatfpointNo" align="center" label="报废地点" prop="fpointNo" />
      <el-table-column :formatter="formatfmrkuser" align="center" label="报废人员" prop="fmrkuser" />
      <el-table-column width="100" :formatter="datetimeFormat" align="center" label="报废日期" prop="fmrkdate" />
      <el-table-column align="center" label="品项数" prop="fitemcount" />
      <el-table-column align="center" label="总件数" prop="fpiececount" />
      <el-table-column align="center" label="备注" prop="fexplanation" />
      <el-table-column align="left" :width="buttonColor.state" label="单据状态" prop="fbillstate">
        <template slot-scope="scope">
          <span :style="{ color: buttonColor.itemisconfirmed }" v-if="scope.row.fbillstate === 1">{{ scope.row.fbillstate |
              statusFilter
          }}</span>
          <span :style="{ color: buttonColor.itemconfirmed }" v-else-if="scope.row.fbillstate === 2">{{ scope.row.fbillstate | statusFilter }}</span>
          <span :style="{ color: buttonColor.iteminvalid }" v-else>{{ scope.row.fbillstate | statusFilter }}</span>
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total > 0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit"
      @pagination="getList" />

    <!-- 主表添加或修改对话框 -->
    <el-dialog width="auto" :close-on-click-modal="false" :visible.sync="dialogFormVisible" :before-close="handleClose">
      <template slot="title">
        <div :style="titleColor">{{ textMap[dialogStatus] }}</div>
      </template>
      <el-form ref="dataForm" :rules="rules" :model="dataForm" status-icon label-position="left" label-width="auto">
        <el-row>
          <el-col :span="8">
            <el-form-item label="单据编号" prop="fbillno">
              <el-input :disabled="true" v-model="dataForm.fbillno" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="报废日期" prop="fmrkdate">
              <el-date-picker :disabled="true" v-model="dataForm.fmrkdate" type="date" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="单据状态" prop="fbillstate">
              <el-select disabled v-model="dataForm.fbillstate" class="filter-item" clearable>
                <el-option v-for="item in fbillstateOptions" :key="item.value" :label="item.label"
                  :value="item.value" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8">
            <el-form-item v-if="this.$store.state.user.fsiteLevel == 3" label="客户名称" prop="fsiteNo">
              <el-select disabled v-model="dataForm.fsiteNo" clearable filterable class="filter-item"
                placeholder="请选择客户名称">
                <el-option v-for="item in getListfsiteNo" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
            </el-form-item>
            <el-form-item label="客户名称" prop="fsiteNo" v-else>
              <el-select v-if="dialogStatus == 'create'" @change="changeFsiteNoAdd" v-model="dataForm.fsiteNo" clearable
                filterable class="filter-item" placeholder="请选择客户名称">
                <el-option v-for="item in getListfsiteNo" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
              <el-select v-else disabled v-model="dataForm.fsiteNo" clearable filterable class="filter-item"
                placeholder="请选择客户名称">
                <el-option v-for="item in getListfsiteNo" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item v-if="this.$store.state.user.fsiteLevel == 3" label="报废地点" prop="fpointNo">
              <div style="
                  display: flex;
                  justify-content: flex-end;
                  align-items: center;
                ">
                <el-select @change="pointChange" style="display: inline-block" clearable filterable
                  v-model="dataForm.fpointNo" class="filter-item" placeholder="请选择报废地点">
                  <el-option v-for="item in getListfpointNo" :key="item.value" :label="item.label"
                    :value="item.value" />
                </el-select>
                <i style="
                    display: inline-block;
                    color: #409eff;
                    margin-left: 3px;
                  " class="el-icon-search" @click="searchDialoglab('add')" />
              </div>
            </el-form-item>
            <el-form-item v-else label="报废地点" prop="fpointNo">
              <div style="
                  display: flex;
                  justify-content: flex-end;
                  align-items: center;
                ">
                <el-select @change="pointChange" style="display: inline-block" clearable filterable
                  v-model="dataForm.fpointNo" class="filter-item" placeholder="请选择报废地点">
                  <el-option v-for="item in getListfpointNoAreaAdd" :key="item.value" :label="item.label"
                    :value="item.value" />
                </el-select>
                <i style="
                    display: inline-block;
                    color: #409eff;
                    margin-left: 3px;
                  " class="el-icon-search" @click="searchDialoglab('add')" />
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item v-if="this.$store.state.user.fsiteLevel == 3" label="报废人员" prop="fmrkuser">
              <div style="
                  display: flex;
                  justify-content: flex-end;
                  align-items: center;
                ">
                <el-select style="display: inline-block" clearable filterable v-model="dataForm.fmrkuser"
                  class="filter-item" placeholder="请选择报废人员">
                  <el-option v-for="item in getListfmrkuser" :key="item.value" :label="item.label"
                    :value="item.value" />
                </el-select>
                <i style="
                    display: inline-block;
                    color: #409eff;
                    margin-left: 3px;
                  " class="el-icon-search" @click="searchDialoguse('add')" />
              </div>
            </el-form-item>
            <el-form-item v-else label="报废人员" prop="fmrkuser">
              <div style="
                  display: flex;
                  justify-content: flex-end;
                  align-items: center;
                ">
                <el-select style="display: inline-block" clearable filterable v-model="dataForm.fmrkuser"
                  class="filter-item" placeholder="请选择报废人员">
                  <el-option v-for="item in getListfmrkuserAreaAdd" :key="item.value" :label="item.label"
                    :value="item.value" />
                </el-select>
                <i style="
                    display: inline-block;
                    color: #409eff;
                    margin-left: 3px;
                  " class="el-icon-search" @click="searchDialoguse('add')" />
              </div>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="16">
            <el-form-item label="备注" class="text" style="width: 100%" prop="fexplanation">
              <el-input v-model="dataForm.fexplanation" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <el-tabs type="border-card">
        <el-tab-pane label="设备列表">
          <div class="app-container">
            <!-- 查询和其他操作 -->
            <div class="filter-container">
              <el-button round size="medium" class="filter-item"
                :style="{ background: buttonColor.lookup, color: buttonColor.color }" @click="handleUpdate1">添加
              </el-button>
            </div>

            <!-- 查询结果 -->
            <el-table v-loading="listLoading" :data="dataForm.details" :header-cell-style="tableColor" stripe
              element-loading-text="正在查询中。。。" border fit highlight-current-row height="30vh">
              <el-table-column align="center" label="序" prop="fline" />
              <el-table-column align="center" label="存放位置" prop="fpointSize" />
              <el-table-column width="100" align="center" label="固定资产码" prop="fequipmentbarcode" />
              <el-table-column align="center" label="设备标签" prop="fequipmenttag" />
              <el-table-column align="center" label="序列号" prop="fmacno" />
              <el-table-column align="center" label="排插MAC" prop="flinkmac" width="90" />
              <el-table-column align="center" label="标识符" prop="flinkmark" />
              <el-table-column align="center" label="操作" class-name="small-padding">
                <template slot-scope="scope">
                  <el-button :style="{ background: buttonColor.delete, color: buttonColor.color }" round size="small"
                    class="button-margin" @click="handleDelete1(scope.row)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-tab-pane>
      </el-tabs>

      <div slot="footer" class="dialog-footer">
        <div v-if="viewFlag == false">
          <el-button round :style="{ background: buttonColor.cancel, color: buttonColor.colorone }" @click="cancel()">取消
          </el-button>
          <el-button round v-if="dialogStatus == 'create'"
            :style="{ background: buttonColor.confirm, color: buttonColor.color }" @click="createData">确定</el-button>
          <el-button round v-else :style="{ background: buttonColor.confirm, color: buttonColor.color }"
            @click="updateData">
            确定</el-button>
        </div>
        <div v-else>
          <el-button round :style="{ background: buttonColor.cancel, color: buttonColor.colorone }" @click="cancel()">取消
          </el-button>
          <el-button round v-if="dialogStatus == 'create'"
            :style="{ background: buttonColor.confirm, color: buttonColor.color }" @click="createData">确定</el-button>
        </div>
      </div>
    </el-dialog>

    <!-- 子表添加或修改对话框 -->
    <el-dialog width="auto" top="5vh" :close-on-click-modal="false" :visible.sync="dialogFormVisible1">
      <template slot="title">
        <div :style="titleColor">{{ textMap[dialogStatus] }}</div>
      </template>
      <el-form ref="dataForm1" :rules="rules1" :model="dataForm1" status-icon label-position="left" label-width="auto"
        style="width: 400px; margin:0 30px">
        <el-form-item label="行号" prop="fline">
          <el-input v-model="dataForm1.fline" disabled />
        </el-form-item>
        <el-form-item label="固定资产码" prop="fequipmentbarcode">
          <div style="
              display: flex;
              align-items: center;
            ">
            <el-input v-model="dataForm1.fequipmentbarcode" style="display: inline-block" />
            <i style="
                display: inline-block;
                color: #409eff;
                margin-left: 3px;
              " class="el-icon-search" @click="searchDialogcode" />
          </div>
        </el-form-item>
        <el-form-item label="设备标签" prop="fequipmenttag">
          <el-input disabled v-model="dataForm1.fequipmenttag" />
        </el-form-item>
        <el-form-item label="序列号" prop="fmacno">
          <el-input disabled v-model="dataForm1.fmacno" />
        </el-form-item>
        <el-form-item label="存放位置" prop="fpointSize">
          <el-input disabled v-model="dataForm1.fpointSize" />
        </el-form-item>
        <el-form-item label="排插MAC" prop="flinkmac">
          <el-input disabled v-model="dataForm1.flinkmac" />
        </el-form-item>
        <el-form-item label="标识符" prop="flinkmark">
          <el-input disabled v-model="dataForm1.flinkmark" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button round :style="{ background: buttonColor.cancel, color: buttonColor.colorone }"
          @click="dialogFormVisible1 = false">取消</el-button>
        <el-button round :style="{ background: buttonColor.confirm, color: buttonColor.color }" @click="addData">确定
        </el-button>
      </div>
    </el-dialog>
    <codeDialog :searchVisiblecode.sync="searchVisiblecode" :fpointNo.sync="codeDialogfpointNo" :isUsed.sync="isUsed"
      :fsiteNo.sync="codeDialogFsiteNo" :tableColor="tableColor" @codeDialog="codeDialogValue" />
    <userDialog :searchVisibleuse.sync="searchVisibleuse" :fsiteNo.sync="userDialogFsiteNo" :tableColor="tableColor"
      @userDialog="userDialogValue" />
    <labDialog :searchVisiblelab.sync="searchVisiblelab" :fsiteNo.sync="labDialogFsiteNo" :tableColor="tableColor"
      @labDialog="labDialogValue" />
  </div>
</template>

<style>
.button-margin {
  margin: 2px 0px;
}

.el-button+.el-button {
  margin-left: 1px;
}
</style>

<script>
import {
  listmrkHead,
  createmrkHead,
  updatemrkHead,
  deletemrkHead,
} from "@/api/mrkHead";
import Pagination from "@/components/Pagination";
import moment from "moment";
import { tableColor, titleColor, buttonColor } from "@/filters/index";
import {
  fsiteOptionsByLevel,
  getListArea,
  getFbillno,
  checkBiz,
} from "@/api/area";
import { listinfo } from "@/api/info";
import UserDialog from "@/components/UserDialog";
import LabDialog from "@/components/LabDialog";
import CodeDialog from "@/components/CodeDialog";

const statusMap = {
  1: "未报废",
  2: "已报废",
  8: "已作废",
};

export default {
  name: "STcMrkHead",
  components: { Pagination, UserDialog, LabDialog, CodeDialog },
  filters: {
    statusFilter(type) {
      return statusMap[type];
    },
  },
  data() {
    return {
      buttonColor: buttonColor,
      indexs: 1,
      isUsed: 2,
      getListfpointNoAreaAdd: null,
      getListfpointNoArea: null,
      getListfmrkuserAreaAdd: null,
      getListfmrkuserArea: null,
      viewFlag: false,
      labFlag: null,
      searchVisiblelab: false,
      labDialogFsiteNo: null,

      searchVisibleuse: false,
      userDialogFsiteNo: null,
      userFlag: null,

      searchVisiblecode: false,
      codeDialogFsiteNo: null,
      codeDialogfpointNo: null,

      getListfmrkuser: null,
      selectList: [],
      getListfsiteNo: null,
      getListfpointNo: null,
      equipmentList: [],
      list: null,
      total: 0,
      listLoading: true,
      alarmdate: null,
      listQuery: {
        page: 1,
        limit: 20,
        fsiteNo: undefined,
        fmrkuser: undefined,
        fmrkdate: undefined,
        ftakedateStart: undefined,
        ftakedateEnd: undefined,
        fpointNo: undefined,
        fitemcount: undefined,
        fpiececount: undefined,
        ftotalamt: undefined,
        fexplanation: undefined,
        fupddate: undefined,
        foperator: undefined,
        fcheckdate: undefined,
        fcheckuser: undefined,
        fbillstate: undefined,
        sort: "create_time",
        order: "desc",
      },
      fbillstateOptions: [
        { value: 1, label: "未报废" },
        { value: 2, label: "已报废" },
        { value: 8, label: "已作废" },
      ],
      ftypeOptions: [
        { value: 1, label: "手工报废" },
        { value: 2, label: "自动报废" },
      ],
      dataForm: {
        fsiteNo: undefined,
        fmrkuser: undefined,
        fmrkdate: undefined,
        fpointNo: undefined,
        fitemcount: undefined,
        fpiececount: undefined,
        ftotalamt: undefined,
        fexplanation: undefined,
        fupddate: undefined,
        foperator: undefined,
        fcheckdate: undefined,
        fcheckuser: undefined,
        fbillstate: undefined,
        id: undefined,
        details: [],
      },
      dataForm1: {
        fpointSize: undefined,
        fequipmentbarcode: undefined,
        feuipmentid: undefined,
        fequipmenttag: undefined,
        fspec: undefined,
        fmacno: undefined,
        flinkmac: undefined,
        flinkmark: undefined,
      },
      dialogFormVisible1: false,
      dialogStatus1: "",
      actionsTmp: [],
      listTmp: [],
      dialogFormVisible: false,
      dialogStatus: "",
      textMap: {
        update: "编辑",
        create: "创建",
      },
      tableColor: tableColor,
      titleColor: titleColor,
      rules: {
        fsiteNo: [{ required: true, message: "客户编号不能为空" }],
        fmrkuser: [
          { required: true, message: "报废人员不能为空", trigger: "blur" },
        ],
        fmrkdate: [{ required: true, message: "报废日期不能为空" }],
        fpointNo: [
          { required: true, message: "报废地点不能为空", trigger: "blur" },
        ],
        fitemcount: [
          {
            type: "number",
            message: "品项数必须为数字值",
            transform: (value) => Number(value),
          },
        ],
        fpiececount: [
          {
            type: "number",
            message: "总件数必须为数字值",
            transform: (value) => Number(value),
          },
        ],
        ftotalamt: [
          {
            type: "number",
            message: "总价必须为数字值",
            transform: (value) => Number(value),
          },
        ],
        fexplanation: [],
        fupddate: [],
        foperator: [],
        fcheckdate: [],
        fcheckuser: [],
        fbillstate: [
          {
            type: "number",
            message: "单据状态必须为数字值",
            transform: (value) => Number(value),
          },
        ],
      },
      rules1: {
        fline: [
          { required: true, message: "行号不能为空" },
          {
            type: "number",
            message: "行号必须为数字值",
            transform: (value) => Number(value),
          },
        ],
        fequipmentbarcode: [{ required: true, message: "固定资产码不能为空" }],
        feuipmentid: [
          { required: true, message: "设备编号不能为空" },
          {
            type: "number",
            message: "设备编号必须为数字值",
            transform: (value) => Number(value),
          },
        ],
        fmacno: [],
        fequipmenttag: [],
        flinkmac: [],
        flinkmark: [],
        fbuyprice: [
          { required: true, message: "采购价不能为空" },
          {
            type: "number",
            message: "采购价必须为数字值",
            transform: (value) => Number(value),
          },
        ],
      },
    };
  },
  created() {
    this.alarmdate = [
      this.parserDate(moment(new Date().setDate(1)).format("YYYY-MM-DD")),
      new Date(),
    ];
    this.getList();
    // 客户名称
    fsiteOptionsByLevel(3)
      .then((response) => {
        this.getListfsiteNo = response.data.data.list;
      })
      .catch(() => {
        this.getListfsiteNo = [];
      });
    if (this.$store.state.user.fsiteLevel == 3) {
      this.listQuery.fsiteNo = this.$store.state.user.fsiteNo;
      // 地点
      getListArea({ flag: 10, arg1: this.$store.state.user.fsiteNo })
        .then((response) => {
          this.getListfpointNo = response.data.data.list;
        })
        .catch(() => {
          this.getListfpointNo = [];
        });
      // 人员弹出框
      getListArea({ flag: 13, arg1: this.$store.state.user.fsiteNo })
        .then((response) => {
          this.getListfmrkuser = response.data.data.list;
        })
        .catch(() => {
          this.getListfmrkuser = [];
        });
    } else {
      // 地点
      getListArea({ flag: 10 })
        .then((response) => {
          this.getListfpointNo = response.data.data.list;
        })
        .catch(() => {
          this.getListfpointNo = [];
        });
      // 人员弹出框
      getListArea({ flag: 13 })
        .then((response) => {
          this.getListfmrkuser = response.data.data.list;
        })
        .catch(() => {
          this.getListfmrkuser = [];
        });
    }
    // 全部设备列表
    listinfo()
      .then((response) => {
        this.equipmentList = response.data.data.list;
      })
      .catch(() => {
        this.equipmentList = [];
      });
  },
  methods: {
    datetimeFormat(row, column) {
      const date = row[column.property];
      if (date === undefined || date === null) {
        return "";
      }
      return moment(date).format("YYYY-MM-DD");
    },
    parserDate(date) {
      var t = Date.parse(date);
      if (!isNaN(t)) {
        return new Date(Date.parse(date.replace(/-/g, "/")));
      }
    },

    formatfsiteNo: function (row, column) {
      if (this.getListfsiteNo) {
        for (let i = 0; i < this.getListfsiteNo.length; i++) {
          if (row.fsiteNo === this.getListfsiteNo[i].value) {
            return this.getListfsiteNo[i].label;
          }
        }
        return "";
      } else {
        return "";
      }
    },

    changeFsiteNo(data) {
      this.listQuery.fpointNo = "";
      this.listQuery.fmrkuser = "";
      this.getListfpointNoArea = [];
      this.getListfmrkuserArea = [];
      if (data) {
        // 存放地点
        getListArea({ flag: 10, arg1: data })
          .then((response) => {
            this.getListfpointNoArea = response.data.data.list;
          })
          .catch(() => {
            this.getListfpointNoArea = [];
          });

        // 人员弹出框
        getListArea({ flag: 13, arg1: data })
          .then((response) => {
            this.getListfmrkuserArea = response.data.data.list;
          })
          .catch(() => {
            this.getListfmrkuserArea = [];
          });
      }
    },

    changeFsiteNoAdd(data) {
      this.dataForm.fpointNo = "";
      this.dataForm.fmrkuser = "";
      this.getListfpointNoAreaAdd = [];
      this.getListfmrkuserAreaAdd = [];
      this.dataForm.details = [];
      this.selectList = [];
      if (data) {
        // 存放地点
        getListArea({ flag: 10, arg1: data })
          .then((response) => {
            this.getListfpointNoAreaAdd = response.data.data.list;
          })
          .catch(() => {
            this.getListfpointNoAreaAdd = [];
          });

        // 人员弹出框
        getListArea({ flag: 13, arg1: data })
          .then((response) => {
            this.getListfmrkuserAreaAdd = response.data.data.list;
          })
          .catch(() => {
            this.getListfmrkuserAreaAdd = [];
          });
      }
    },

    // 搜索人员弹出框
    searchDialoguse(value) {
      this.userFlag = value;
      if (value === "add") {
        this.userDialogFsiteNo = this.dataForm.fsiteNo;
      } else {
        this.userDialogFsiteNo = this.listQuery.fsiteNo;
      }
      this.searchVisibleuse = true;
    },

    // 人员弹出框返回值
    userDialogValue(value) {
      if (this.userFlag === "add") {
        this.dataForm.fmrkuser = value.user.id.toString();
      } else {
        this.listQuery.fmrkuser = value.user.id.toString();
      }
    },

    // 搜索地点弹出框
    searchDialoglab(value) {
      this.labFlag = value;
      if (value === "add") {
        this.labDialogFsiteNo = this.dataForm.fsiteNo;
      } else {
        this.labDialogFsiteNo = this.listQuery.fsiteNo;
      }
      this.searchVisiblelab = true;
    },

    // 地点弹出框返回值
    labDialogValue(value) {
      if (this.labFlag === "add") {
        this.dataForm.fpointNo = value.lab.fpointNo;
        this.dataForm.details = [];
        this.selectList = [];
      } else {
        this.listQuery.fpointNo = value.lab.fpointNo;
      }
    },

    // 固定资产码弹出框
    searchDialogcode(value) {
      this.codeDialogFsiteNo = this.dataForm.fsiteNo;
      this.codeDialogfpointNo = this.dataForm.fpointNo;
      this.searchVisiblecode = true;
    },

    // 固定资产码弹出框返回值
    codeDialogValue(value) {
      this.dataForm1.fequipmentbarcode = value.info.fequipmentbarcode;
      this.dataForm1.feuipmentid = value.info.feuipmentid;
      this.dataForm1.fequipmenttag = value.info.fequipmenttag;
      this.dataForm1.fspec = value.info.fspec;
      this.dataForm1.fmacno = value.info.fmacno;
      this.dataForm1.flinkmac = value.info.flinkmac;
      this.dataForm1.flinkmark = value.info.flinkmark;
      this.dataForm1.fpointSize = value.info.fpointSize;
      this.dataForm1.fbuyprice = 0;
    },

    // 存放地点
    formatfpointNo: function (row, column) {
      if (this.getListfpointNo) {
        for (let i = 0; i < this.getListfpointNo.length; i++) {
          if (row.fpointNo === this.getListfpointNo[i].value) {
            return this.getListfpointNo[i].label;
          }
        }
        return "";
      } else {
        return "";
      }
    },
    // 报废地点改变
    pointChange() {
      this.dataForm.details = [];
      this.selectList = [];
    },

    // 人员
    formatfmrkuser: function (row, column) {
      if (this.getListfmrkuser) {
        for (let i = 0; i < this.getListfmrkuser.length; i++) {
          if (row.fmrkuser == this.getListfmrkuser[i].value) {
            return this.getListfmrkuser[i].label;
          }
        }
        return "";
      } else {
        return "";
      }
    },

    // 型号回显
    formatfspec(row) {
      if (this.equipmentList.length > 0) {
        for (let i = 0; i < this.equipmentList.length; i++) {
          if (row.feuipmentid === this.equipmentList[i].feuipmentid) {
            return this.equipmentList[i].fspec;
          }
        }
        return "";
      } else {
        return "";
      }
    },
    formatDate: function (date) {
      if (typeof date === "object") {
        var ym;
        var y = date.getFullYear();
        var m = date.getMonth() + 1;
        var d = date.getDate();
        if (m < 10) {
          m = "0" + m;
        }
        if (d < 10) {
          d = "0" + d;
        }
        ym = "" + y + m + d;
        return ym;
      } else {
        return date;
      }
    },
    getList() {
      this.listQuery.ftakedateStart =
        this.alarmdate == null ? null : this.formatDate(this.alarmdate[0]);
      this.listQuery.ftakedateEnd =
        this.alarmdate == null ? null : this.formatDate(this.alarmdate[1]);
      this.listLoading = true;
      listmrkHead(this.listQuery)
        .then((response) => {
          this.list = response.data.data.list;
          this.total = response.data.data.total;
          this.listLoading = false;
        })
        .catch(() => {
          this.list = [];
          this.total = 0;
          this.listLoading = false;
        });
    },
    handleFilter() {
      this.listQuery.page = 1;
      this.getList();
    },
    resetForm() {
      this.dataForm = {
        fsiteNo: undefined,
        fmrkuser: undefined,
        fmrkdate: undefined,
        fpointNo: undefined,
        fitemcount: undefined,
        fpiececount: undefined,
        ftotalamt: undefined,
        fexplanation: undefined,
        fupddate: undefined,
        foperator: undefined,
        fcheckdate: undefined,
        fcheckuser: undefined,
        fbillstate: undefined,
        id: undefined,
        details: [],
      };
    },
    handleCreate() {
      this.resetForm();
      // 单据编号
      getFbillno({ flag: 2011 })
        .then((response) => {
          if (response) {
            this.dataForm.fbillno = response.data.data;
            this.dialogFormVisible = true;
            this.$nextTick(() => {
              this.$refs["dataForm"].clearValidate();
            });
          }
        })
        .catch(() => {
          this.dataForm.fbillno = "";
        });

      if (this.$store.state.user.fsiteLevel == 3) {
        this.dataForm.fmrkuser = this.$store.state.user.id.toString();
        this.dataForm.fsiteNo = this.$store.state.user.fsiteNo;
      } else {
        this.getListfpointNoAreaAdd = [];
        this.getListfmrkuserAreaAdd = [];
      }

      this.dataForm.fmrkdate = new Date();
      this.dataForm.fbillstate = 1;
      this.dialogStatus = "create";
    },
    createData() {
      this.$refs["dataForm"].validate((valid) => {
        if (valid) {
          this.dataForm.foperator = this.$store.state.user.id;
          this.dataForm.fupddate = new Date();
          createmrkHead(this.dataForm)
            .then((response) => {
              this.list.unshift(response.data.data);
              this.dialogFormVisible = false;
              this.$notify.success({
                title: "成功",
                message: "添加设备报废主表成功",
              });
              this.selectList = [];
              this.indexs = 1;
            })
            .catch((response) => {
              this.$notify.error({
                title: "失败",
                message: response.data.data,
              });
            });
        }
      });
    },
    handleUpdate(row) {
      if (row.fbillstate == "1") {
        this.viewFlag = false;
      } else {
        this.viewFlag = true;
      }
      this.listTmp = row;
      this.actionsTmp = [];
      row.details.forEach((v) => {
        this.actionsTmp.push(v);
        this.selectList.push(v.fequipmentbarcode);
      });

      this.dataForm = Object.assign({}, row);
      if (this.$store.state.user.fsiteLevel != 3) {
        // 存放地点
        getListArea({ flag: 10, arg1: row.fsiteNo })
          .then((response) => {
            this.getListfpointNoAreaAdd = response.data.data.list;
          })
          .catch(() => {
            this.getListfpointNoAreaAdd = [];
          });

        // 人员弹出框
        getListArea({ flag: 13, arg1: row.fsiteNo })
          .then((response) => {
            this.getListfmrkuserAreaAdd = response.data.data.list;
          })
          .catch(() => {
            this.getListfmrkuserAreaAdd = [];
          });
      }
      this.dialogStatus = "update";
      this.dialogFormVisible = true;
      var end = row.details[row.details.length - 1];
      this.indexs = end.fline + 1;
      this.$nextTick(() => {
        this.$refs["dataForm"].clearValidate();
      });
    },
    updateData() {
      this.$refs["dataForm"].validate((valid) => {
        if (valid) {
          this.dataForm.foperator = this.$store.state.user.id;
          this.dataForm.fupddate = new Date();
          updatemrkHead(this.dataForm, this.$route.query.id)
            .then(() => {
              for (const v of this.list) {
                if (v.fbillno === this.dataForm.fbillno) {
                  const index = this.list.indexOf(v);
                  this.list.splice(index, 1, this.dataForm);
                  break;
                }
              }
              this.dialogFormVisible = false;
              this.$notify.success({
                title: "成功",
                message: "更新设备报废主表成功",
              });
              this.selectList = [];
            })
            .catch((response) => {
              this.$notify.error({
                title: "失败",
                message: response.data.data,
              });
            });
        }
      });
    },
    audit(row) {
      this.$confirm("是否确定", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.dataForm = Object.assign({}, row);
        checkBiz({
          pBillNo: this.dataForm.fbillno,
          pBillState: 2,
          pBizType: "s_tc_mrk_head",
          pUser: this.$store.state.user.id,
        })
          .then(() => {
            for (const v of this.list) {
              if (v.fbillno === this.dataForm.fbillno) {
                this.dataForm.fbillstate = 2;
                const index = this.list.indexOf(v);
                this.list.splice(index, 1, this.dataForm);
                break;
              }
            }
            this.$notify.success({
              title: "成功",
              message: "确认成功",
            });
          })
          .catch((response) => {
            this.$notify.error({
              title: "失败",
              message: response.data.data,
            });
          });
      });
    },

    auditDelete(row) {
      this.$confirm("是否确定作废", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.dataForm = Object.assign({}, row);
        this.dataForm.fbillstate = 8;
        updatemrkHead(this.dataForm, this.$route.query.id)
          .then(() => {
            for (const v of this.list) {
              if (v.fbillno === this.dataForm.fbillno) {
                const index = this.list.indexOf(v);
                this.list.splice(index, 1, this.dataForm);
                break;
              }
            }
            this.$notify.success({
              title: "成功",
              message: "作废成功",
            });
            this.selectList = [];
          })
          .catch((response) => {
            this.$notify.error({
              title: "失败",
              message: response.data.data,
            });
          });
      });
    },
    handleDelete(row) {
      this.$confirm("是否要删除设备报废主表", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        deletemrkHead(row)
          .then((response) => {
            this.$notify.success({
              title: "成功",
              message: "删除设备报废主表成功",
            });
            const index = this.list.indexOf(row);
            this.list.splice(index, 1);
          })
          .catch((response) => {
            this.$notify.error({
              title: "失败",
              message: response.data.data,
            });
          });
      });
    },
    indexMethod(index) {
      index = index + 1;
      return index;
    },

    handleUpdate1() {
      this.dataForm1 = {
        fline: this.indexs,
        fpointSize: undefined,
        fequipmentbarcode: undefined,
        feuipmentid: undefined,
        fequipmenttag: undefined,
        fspec: undefined,
        fmacno: undefined,
        flinkmac: undefined,
        flinkmark: undefined,
      };
      this.dialogStatus1 = "create";
      this.dialogFormVisible1 = true;
      this.$nextTick(() => {
        this.$refs["dataForm1"].clearValidate();
      });
    },

    handleDelete1(row) {
      const index = this.dataForm.details.indexOf(row);
      this.dataForm.details.splice(index, 1);
      this.selectList.splice(index, 1);
      // this.dataForm.details.pop(row)
    },
    addData() {
      this.$refs["dataForm1"].validate((valid) => {
        this.dataForm1.fline = this.indexs;
        // 判断固定资产码是否重复
        const tem = this.selectList.indexOf(this.dataForm1.fequipmentbarcode);
        if (tem < 0) {
          if (valid) {
            this.dialogFormVisible1 = false;
            this.dataForm.details.push(this.dataForm1);
            this.selectList.push(this.dataForm1.fequipmentbarcode);
            this.indexs++;
          }
        } else {
          this.$notify.error({
            title: "失败",
            message: "所选设备重复",
          });
          return;
        }
      });
    },
    // 弹窗点击关闭前的回调
    handleClose() {
      this.indexs = 1;
      this.dialogFormVisible = false;
      this.selectList = [];
      this.list.forEach((v) => {
        if (v.fbillno === this.dataForm.fbillno) {
          this.dataForm = this.listTmp;
          this.dataForm.details = this.actionsTmp;
          const index = this.list.indexOf(v);
          this.list.splice(index, 1, this.dataForm);
          return;
        }
      });
    },
    cancel() {
      this.indexs = 1;
      this.dialogFormVisible = false;
      this.selectList = [];
      this.list.forEach((v) => {
        if (v.fbillno === this.dataForm.fbillno) {
          this.dataForm = this.listTmp;
          this.dataForm.details = this.actionsTmp;
          const index = this.list.indexOf(v);
          this.list.splice(index, 1, this.dataForm);
          return;
        }
      });
    },
  },
};
</script>
